<include file="../header" />
<style>
	.keyword-input{
		margin-top: 1rem;
	}
	.keyword-btn{
		margin-top: 0.5rem;
		width: 120px;
		float: left;
	}
	.kw-btn{
		width: 50px;
	}
	.shut-down{
		width: 12px;
		height: 12px;
		position: relative;
		left: -0.5rem;
		top: -0.9rem;
		cursor: pointer;
	}
</style>
<script type="text/javascript" src="/Template/js/vue.min.js"></script>
<body class="J_scroll_fixed" id="container">
<script type="text/javascript">
	$(function() {

		var app = new Vue({
			el: '#container',
			data: {
				keywordList: []
			},
			methods: {
				remove: function(index) {
					app.keywordList.splice(index,1);
				}
			}
		})

		$("a.add-keyword").bind("click", function() {

			var code = $(this).prev().find("input").val();
			var keyword = $(this).prev().prev().find("input").val();

			if(keyword == "") {
				alert("关键词不能为空");
				return false;
			}

			if(code == "") {
				alert("编码不能为空");
				return false;
			}

			var data = [];

			data.code = code;
			data.keyword = keyword;

			app.keywordList.push(data);

			$(this).prev().find("input").val("");
			$(this).prev().prev().find("input").val("");

		});

		var description = UE.getEditor('description',{
			initialFrameHeight:300,
			initialContent : "",
			serverUrl :'{:U("activity/ueditorUpload")}'
		});

		$("button#upload").click(function(){
			//上传文件
			$.ajaxFileUpload({
				url:"{:U('activity/uploadImage')}",//处理图片脚本
				secureuri :false,
				fileElementId :'fileToUpload',//file控件id
				dataType : 'json',
				success : function (data, status){
					$("input[name=imageUrl]").val(data);
					$("img[name=preShow]").attr("src", data);
				},
				error: function(data, status, e){
					alert(e);
				}
			})
		});

		var measureDescription = UE.getEditor('measureDescription',{
			initialFrameHeight:300,
			initialContent : "",
			serverUrl :'{:U("activity/ueditorUpload")}'
		});

		$("button#upload1").click(function(){
			//上传文件
			$.ajaxFileUpload({
				url:"{:U('product/commonUploadImage')}",//处理图片脚本
				secureuri :false,
				fileElementId :'fileToUpload1',//file控件id
				dataType : 'json',
				data:{
					"name": "fileToUpload1"
				},
				success : function (data, status){
					$("input[name=measureImage]").val(data);
					$("img[name=preShowMeasureImage]").attr("src", data);
				},
				error: function(data, status, e){
					alert(e);
				}
			})

		});

		$("button.btn_submit").click(function() {

			$("input[name=description]").val(description.getContent());
			$("input[name=measureDescription]").val(measureDescription.getContent());

			if($("select[name=needMeasure]").val() == 1) {

				var measureJson = {};

				if(app.keywordList.length == 0) {
					alert("请先添加测量元素");
					return false;
				}

				for (var i=0; i<app.keywordList.length; i++) {
					var data = {};
					data["keyword"] = app.keywordList[i]["keyword"];
					data["code"] = app.keywordList[i]["code"];
					measureJson[i] = data;
				}

				$("input[name=measureJson]").val(JSON.stringify(measureJson));

			}

			$("form").submit();

		})

		if("{$info.need_measure}" == 1) {

			$.ajax({
				url:"/admin/product/measureJson",
				type:"post",
				data:{
					id: "{$info.product_id}"
				},
				dataType:"JSON",
				success:function(data){
					app.keywordList = data;
				},
			})

		} else {
			$(".keyword").hide();
		}

		$("select[name=needMeasure]").change(function() {
			if($(this).val() == -1) {
				$(".keyword").hide();
			} else {
				$(".keyword").show();
			}
		});

	})

</script>
<script type="text/javascript"  src="__TMP__/assets/js/ueditor/ueditor.config.js"></script>
<script type="text/javascript"  src="__TMP__/assets/js/ueditor/ueditor.all.min.js"></script>
<div class="wrap jj">
	<div class="common-form">
		<form method="post" class="form-horizontal J_ajaxForm" action="{:U('product/editPost')}">
			<fieldset>
				<input type="hidden" name="id" value="{$info.product_id}" />
				<div class="control-group">
					<label class="control-label">商品名称：</label>
					<div class="controls">
						<input type="text" class="input" name="productName" value="{$info.product_name}">
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">商品图片:</label>
					<div class="controls">
						<input id="fileToUpload" type="file" name="fileToUpload" style="width:170px;">
						<button type="button" class="btn btn-primary" id="upload">上传</button>
						<input type="hidden" name="imageUrl" value="{$info.image_url}" />
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">图片预览:</label>
					<div class="controls">
						<img src="{$info.image_url}" name="preShow" style="width:200px;height:200px;" />
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">所属病症：</label>
					<div class="controls">
						<select name="categoryId">
							{:getCategorySelectOptionHtml($info['category_id'], 0)}
						</select>
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">价格：</label>
					<div class="controls">
						<input type="text" class="input" name="price" value="{$info.price}">
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">需要测量：</label>
					<div class="controls">
						{:getEnumSelectWidget(C("DEFAULT_YN"), "needMeasure", $info['need_measure'], 0)}
						<div class="keyword">
							<div class="keyword-input">
								<span>关键词：<input class="keyword-name" type="text"></span>
								<span>编码：<input class="keyword-code" type="text"></span>
								<a href="javascript:void(0)" class="btn btn-success add-keyword">添加</a>
								<div class="keyword-btns">
									<div class="keyword-btn" v-for="(index,keyword) in keywordList">
										<a class="btn btn-danger kw-btn">{{keyword.keyword}}</a>
										<img v-on:click="remove(index)" class="shut-down" src="/Template/images/icon-shutdown.jpg" alt="x">
									</div>
								</div>
								<input type="hidden" name="measureJson" value="" />
							</div>
						</div>
					</div>
				</div>
				<div class="control-group keyword">
					<label class="control-label">测量示意：</label>
					<div class="controls">
						<input type="hidden" name="measureDescription" />
						<script type="text/plain" id="measureDescription" name="measureDescription">{$info.measure_description}</script>
					</div>
				</div>
				<div class="control-group keyword">
					<label class="control-label">测量示意图:</label>
					<div class="controls">
						<input id="fileToUpload1" type="file" name="fileToUpload1" style="width:170px;">
						<button type="button" class="btn btn-primary" id="upload1">上传</button>
						<input type="hidden" name="measureImage" value="{$info.measure_image}" />
					</div>
				</div>
				<div class="control-group keyword">
					<label class="control-label">测量示意图预览:</label>
					<div class="controls">
						<img src="{$info.measure_image}" name="preShowMeasureImage" style="width:200px;height:200px;" />
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">详情描述：</label>
					<div class="controls">
						<input type="hidden" name="description" />
						<script type="text/plain" id="description" name="description">{$info.description}</script>
					</div>
				</div>
				<hr class="half-rule">
				<div class="control-group">
					<label class="control-label">团购状态：</label>
					<div class="controls">
						{:getEnumSelectWidget($statusEnum, "groupStatus", $info["group_status"], 0)}
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">团购码：</label>
					<div class="controls">
						<input type="text" class="input" name="groupCode" value="{$info.group_code}">
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">团购价格：</label>
					<div class="controls">
						<input type="text" class="input" name="groupPrice" value="{$info.group_price}">
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">团购截止日期：</label>
					<div class="controls">
						<input type="text" class="input J_date" style="width: 100px" name="expiryDate" value="{$info.expiry_date}">
					</div>
				</div>

			</fieldset>
			<div class="form-actions">
				<button type="button" class="btn btn-primary btn_submit">更新</button>
				<a class="btn" href="__URL__">返回</a>
			</div>
		</form>
	</div>
</div>
<script src="__ROOT__/statics/js/common.js"></script>
</body>
</html>